<template>
  <div>
    <div>代码展示:</div>

    <div>
      {{ code }}
    </div>
  </div>
</template>
>

<script>
export default {
  // eslint-disable-next-line vue/multi-word-component-names
  name: "show",
  props: {
    code: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
      code: "",
    };
  },
  methods: {
    getSource(type) {
      const reg = new RegExp(`<${type}[^>]*>`);
      let matchs = this.code.match(reg);
      if (matchs) {
        let tag = matchs[0];
        return this.code, slice(this.code.indexOf(tag + tag.length));
      }
    },
    //   1.获取模板中html js style
    run(value) {
      this.code = value;
      const template = this.getSource("template");
      const script = this.getSource("script");
      const style = this.getSource("style");
    },
  },
};
</script>

<style></style>
